<!--
 * @Description: 告警规则详情
 * @Author: 0001101008/HuYuxi
 * @Date: 2021-09-06 15:10:51
 * @LastEditTime: 2021-09-28 10:20:26
 * @LastEditors: 0001101008/HuYuxi
-->
<template>
  <div>
    <table class="backbone-info">
      <template v-if="ruleInfo">
        <tr>
          <td>网元类型</td>
          <td :colspan="3">{{ruleInfo.neType ? ruleInfo.neType : '-'}}</td>
        </tr>
        <tr>
          <td>联系人</td>
          <td v-if="ruleInfo.attrs">{{ruleInfo.attrs.contacts ? ruleInfo.attrs.contacts : '-'}}</td>
          <td v-else>-</td>
          <td>前转方式</td>
          <td
            v-if="ruleInfo.attrs"
          >{{ruleInfo.attrs.forwardType ? ruleInfo.attrs.forwardType === 'email'? '邮箱': '短信' : '-'}}</td>
          <td v-else>-</td>
        </tr>
        <template v-if="positionData.length > 0">
          <tr v-for="(item, index) in positionData" :key="index">
            <td>位置</td>
            <td>{{item.name}}</td>
            <td>网元型号</td>
            <td>{{item.typeLabel}}</td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>位置</td>
            <td>-</td>
            <td>网元型号</td>
            <td>-</td>
          </tr>
        </template>
        <template v-if="ruleInfo.codeTxt.length > 0">
          <tr v-for="(item, index) in ruleInfo.codeTxt" :key="index">
            <td>告警码</td>
            <td :colspan="3">{{item.label + '(' + item.id +')'}}</td>
          </tr>
        </template>
        <template v-else>
          <tr>
            <td>告警码</td>
            <td :colspan="3">-</td>
          </tr>
        </template>
      </template>
      <template v-else>
        <tr>
          <td>暂无数据</td>
        </tr>
      </template>
    </table>
  </div>
</template>
<script>
export default {
  props: ['ruleInfo', 'codeDataList'],
  data () {
    return {
      positionData: []
    };
  },
  filters: {
    // 过滤时间
    filterTime (val) {
      if (val === undefined || val === null || val === '') {
        val = '-';
      } else {
        val = val.substring(0, 19);
      }
      return val;
    }
  },
  mounted () {
    let _this = this;
    _this.$nextTick(() => {
      _this.getPositionData();
    });
  },
  methods: {
    // 获取位置信息 => 转化可视数据
    getPositionData () {
      let _this = this;
      if (_this.ruleInfo.position && _this.ruleInfo.position.type === 'NE' && _this.ruleInfo.position.data.length > 0) {
        // 获取网元
        _this.$http.put({
          url: '/api/resource/ne/filter',
          data: {
            neIds: _this.ruleInfo.position.data
          }
        }).then(res => {
          let { objects } = res;
          if (objects.length > 0) {
            let list = [];
            objects.map(item => {
              list.push({
                name: item.userlabel,
                targetId: item.id,
                type: 'NE',
                typeLabel: item.typeLabel
              });
            });
            this.positionData = list;
          }
        });
      }
    },
  }
};
</script>
<style lang="scss" scoped>
.backbone-info {
  width: 100%;
  border: 1px solid #ebeef5;
  tr {
    width: 100%;
    td {
      padding: 5px 15px;
      line-height: 30px;
      &:first-child {
        width: 170px;
        text-align: center;
        background: #f8f8f9;
      }
      &:nth-child(3) {
        width: 170px;
        text-align: center;
        background: #f8f8f9;
      }
      &:last-child {
        width: calc(100% - 170px);
      }
    }
  }
}
</style>
